{% extends "cms/base.html"%}
{% block css%}
{{super()}}
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/github-markdown-css/5.7.0/github-markdown.min.css"
    integrity="sha512-RXrQNShK831yZVcMWsLosdpsHddeG5xP7zMmlDu/OLQdfx24Z9pO1KiFZ1eZrMqY8P9hYgknwU/O6GxR2Fc0Gw=="
    crossorigin="anonymous" referrerpolicy="no-referrer" />
{% endblock%}

{% block content %}

<!-- <nav class="breadcrumb" aria-label="breadcrumbs">
    <ul>
        <li><a href="#">Bulma</a></li>
        <li><a href="/cms">专题</a></li>
        <li class="is-active"><a href="#" aria-current="page">{{article.title}}</a></li>
    </ul>
</nav> -->


<section class="hero">
    <div class="hero-body container pb-5">
        <p class="title">{{article.title}}</p>
        <p class="subtitle">
            <span>发布于 {{article.publish_at|date(format="%Y-%m-%d")}}</span> / <span>阅读量
                {{article.read_number}}</span>
        </p>
    </div>
</section>

<div class="container px-6 pb-6 ">
    <div id="content" class="markdown-body">
        {{article.content | safe}}
    </div>
</div>

<script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
<script defer>
    const content = document.getElementById('content')
    content.innerHTML =
        marked.parse(content.innerHTML.trim());
</script>

{% endblock %}